<template>
	<view class="container">
		<view class="example">
			<!-- 基础用法，不包含校验规则 -->
			<uni-forms label-width="200rpx" ref="baseFormData" :model="baseFormData" :rules="rules">
				<uni-forms-item label="优惠券名称" :required="false" name="name">
					<uni-easyinput :inputBorder="false" v-model="baseFormData.name" />
				</uni-forms-item>
				<uni-forms-item label="优惠券类型" :required="false" name="type">
					<uni-data-checkbox v-model="baseFormData.type" :localdata="types" @change="selectone" />
					<view class="twotype">
						<uni-forms-item label="满" label-width="20px" class="twotype" v-if="baseFormData.type==1"
							name="condition">
							<uni-easyinput v-model="baseFormData.condition" style="border-bottom:1rpx solid #000 ;"
								:clearable="false" :inputBorder="false"></uni-easyinput>
						</uni-forms-item>
						<uni-forms-item label="元减" label-width="40px" class="twotype" v-if="baseFormData.type==1"
							name="preferential">
							<uni-easyinput v-model="baseFormData.preferential" style="border-bottom:1rpx solid #000 ;"
								:clearable="false" :inputBorder="false"></uni-easyinput>
						</uni-forms-item>
						<uni-forms-item label="元" v-if="baseFormData.type==1" label-width="20px" />
					</view>
					<view class="onetype">
						<uni-forms-item label="打" label-width="20px" class="onetype"
							style="display: flex;flex-direction: row;" v-if="baseFormData.type==2" name="discount">
							<uni-easyinput v-model="baseFormData.discount" style="border-bottom:1rpx solid #000 ;"
								:clearable="false" :inputBorder="false"></uni-easyinput>
						</uni-forms-item>
						<uni-forms-item label="折" label-width="20px" v-if="baseFormData.type==2" />
					</view>

				</uni-forms-item>
				<uni-forms-item label="发放开始时间" name="begin">
					<uni-datetime-picker type="datetime" return-type="timestamp" v-model="baseFormData.begin" />
				</uni-forms-item>
				<uni-forms-item label="发放结束时间" name="end">
					<uni-datetime-picker type="datetime" return-type="timestamp" v-model="baseFormData.end" />
				</uni-forms-item>
				<uni-forms-item label="投放数量" :required="false" name="number">
					<uni-easyinput v-model="baseFormData.number" :inputBorder="false" />
				</uni-forms-item>
				<uni-forms-item label="每人限领" :required="false" name="limit">
					<uni-easyinput v-model="baseFormData.limit" :inputBorder="false" />
				</uni-forms-item>
				<!-- 				<uni-forms-item label="使用有效期" :required="false">
					<view class="effectiveDate">
						<uni-forms-item label-width="1px" name="validityS">
							<uni-easyinput v-model="baseFormData.validityS" :inputBorder="false" :clearable="false"
								placeholder="开始时间" />
						</uni-forms-item>
						<uni-forms-item label-width="1px" name="validityE">
							<uni-easyinput v-model="baseFormData.validityE" :inputBorder="false" :clearable="false"
								placeholder="结束时间" />
						</uni-forms-item>
					</view>
				</uni-forms-item> -->
			</uni-forms>
			<button type="primary"
				style="color: #1D6FFF;background-color: white;border:1rpx #1D6FFF solid ;width: 640rpx;font-size: 30rpx;"
				@click="submit('baseFormData')">确定投放</button>
		</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				// 基础表单数据
				baseFormData: {
					name: '', //优惠券名称
					type: 0, //优惠券类型
					condition: null, //满减的条件
					preferential: '', //满减的优惠额度
					discount: '', //折扣额度
					number: '', //投放数量
					limit: 1, //每人限领
					begin: '', //开始发放时间
					end: '', //发放结束时间
					// validityS: '', //有效期开始
					// validityE: '', //有效期结束
					// datetimesingle: 1627529992399
				},
				newbaseFormData: {
					name: '', //优惠券名称
					type: 0, //优惠券类型
					condition: null, //满减的条件
					preferential: '', //满减的优惠额度
					discount: '', //折扣额度
					number: '', //投放数量
					limit: 1, //每人限领
					begin: '', //开始发放时间
					end: '', //发放结束时间
					// validityS: '', //有效期开始
					// validityE: '', //有效期结束
					// datetimesingle: 1627529992399
				},
				// 单选数据源
				types: [{
					text: '满减券',
					value: 1
				}, {
					text: '打折券',
					value: 2
				}],
				// 校验规则
				rules: {
					name: {
						rules: [{
							required: true,
							errorMessage: '名称不能为空'
						}]
					},
					type: {
						rules: [{
							required: true,
							errorMessage: '类型不能为空'
						}]
					},
					condition: {
						rules: [{
							required: true,
							errorMessage: '满减条件不能为空'
						}]
					}, //满减的条件
					preferential: {
						rules: [{
							required: true,
							errorMessage: '满减优惠不能为空'
						}, {
							validateFunction: function(rule, value, data, callback) {
								if (parseFloat(data.preferential) > parseFloat(data.condition)) {
									// 通过返回 resolve
									callback('优惠额不能大于满减金额')
								} else {
									// 不通过返回 reject(new Error('错误信息'))
									return true

								}
							}
						}]
					}, //满减的优惠额度
					discount: {
						rules: [{
							required: true,
							errorMessage: '折扣不能为空'
						}, {
							validateFunction: function(rule, value, data, callback) {
								console.log(data)
								if (value > 10) {
									// 通过返回 resolve
									callback('折扣不能大于10')
								} else {
									// 不通过返回 reject(new Error('错误信息'))
									return true

								}
							}
						}]
					}, //折扣额度
					number: {
						rules: [{
							required: true,
							errorMessage: '投放数量不能为空'
						}]
					}, //投放数量
					limit: {
						rules: [{
							required: true,
							errorMessage: '每人限领数量不能为空'
						}, {
							validateFunction: function(rule, value, data, callback) {
								console.log(data)
								if (value > data.number) {
									// 通过返回 resolve
									callback('每人限领不能大于投放数量')
								} else {
									// 不通过返回 reject(new Error('错误信息'))
									return true

								}
							}

						}]
					}, //每人限领
					begin: {
						rules: [{
							required: true,
							errorMessage: '发放时间不能为空'
						}]
					}, //开始发放时间
					end: {
						rules: [{
							required: true,
							errorMessage: '发放结束时间不能为空'
						}]
					}, //发放结束时间
					// validityS: {
					// 	rules: [{
					// 		required: true,
					// 		errorMessage: '有效期开始时间不能为空'
					// 	}]
					// }, //有效期开始
					// validityE: {
					// 	rules: [{
					// 		required: true,
					// 		errorMessage: '有效期结束时间不能为空'
					// 	}]
					// }, //有效期结束
				},
			}
		},
		computed: {},
		onLoad() {},
		methods: {
			onClickItem(e) {
				console.log(e);
				this.current = e.currentIndex
			},
			add() {
				this.dynamicLists.push({
					label: '域名',
					rules: [{
						'required': true,
						errorMessage: '域名项必填'
					}],
					id: Date.now()
				})
			},
			del(id) {
				let index = this.dynamicLists.findIndex(v => v.id === id)
				this.dynamicLists.splice(index, 1)
			},
			submit(ref) {
				uni.request({
					url: 'http://localhost/dev-api/auth/login',
					method: 'POST',
					data: {
						username:"马六",
						password:"123456"
					},
					success(res) {
						if(res.data.code == 200){
							uni.setStorageSync('token',res.data.data.access_token)
						}
					}
				}),
				this.$refs[ref].validate().then(res => {
					
					// this.baseFormData=this.newbaseFormData
					// console.log(this.newbaseFormData);
					uni.showToast({
						title: `校验通过`
					})
					console.log('success', res);
					uni.request({
						url: "http://localhost:8080/coupon/coupon_admin",
						header: {
							'Authorization': 'Bearer ' + uni.getStorageSync('token')
						},
						method: "POST",
						data:{
							name: this.baseFormData.name, //优惠券名称
							type: this.baseFormData.type, //优惠券类型
							triggerMoney: this.baseFormData.condition, //满减的条件
							preferentialMoney: this.baseFormData.preferential, //满减的优惠额度
							discount: this.baseFormData.discount, //折扣额度
							num: this.baseFormData.number, //投放数量
							size: 1, //每人限领
							start: this.baseFormData.begin, //开始发放时间
							end: this.baseFormData.end, //发放结束时间
						},
						success: (resp) => {
							console.log(resp)
							this.baseFormData=resp.data
						}
					})


					setTimeout(function() {
						uni.redirectTo({
							url: "/pages/CouponsManage/CouponsManage"
						})
					}, 1000)

				}).catch(err => {
					console.log('err', err);
				})
			},
			selectone() {

				if (this.baseFormData.type == 1) {
					this.baseFormData.condition = null
					this.baseFormData.preferential = ''
				} else {
					this.baseFormData.discount = ''
				}

			}

		}
	}
</script>
<style lang="scss">
	page {
		background-color: #fff;
	}

	.twotype {
		display: flex;
		align-items: center;
		width: 500rpx;
	}

	.onetype {
		display: flex;
		align-items: center;
		width: 200rpx;
	}

	.effectiveDate {
		display: flex;
		flex-direction: row;
		// align-items: center;
		width: 400rpx;
	}

	.example {
		padding: 15px;
		background-color: #fff;
	}

	.segmented-control {
		margin-bottom: 15px;
	}

	.button-group {
		margin-top: 15px;
		display: flex;
		justify-content: space-around;
	}

	.form-item {
		display: flex;
		align-items: center;
	}

	.button {
		display: flex;
		align-items: center;
		height: 35px;
		margin-left: 10px;
	}
</style>